<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Soulsign-scripts-build</title>
		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
		<link rel="stylesheet" href="./static/style.css">
		<script src="./static/vue.js" type="text/javascript" charset="UTF-8"></script>
		<!--<script type="text/javascript" src="//vuejs.org/js/vue.min.js"></script>-->
		<script type="text/javascript" src="//unpkg.com/uiv/dist/uiv.min.js"></script>
	</head>
	<body>
		<div id="app">
			<div class="title"><h1>Soulsign-scripts-build</h1></div>
			<div class="repo-badge"><img src="https://img.shields.io/github/license/yi-Xu-0100/soulsign-scripts-build"></div>
        <tabs>
          <tab title="Configration">
            <p>{{scripts_config}}</p>
          </tab>
          <tab title="Script">
            <p>{{scripts}}</p>
          </tab>
          <dropdown slot="nav-right" menu-right>
			  <btn class="dropdown-toggle">选择模板 <span class="caret"></span></btn>
			  <template slot="dropdown">
				  <li v-for="(option, index) in options"><a role="button" @click="index=index">{{option}} - {{index}}</a></li>
			</template>
          </dropdown>
        </tabs>
		</div>
		<script type="text/javascript">
			var app = new Vue({
				el: '#app',
				data: {
					index: 0,
					message: 'Hello Vue!',
					show: false,
					scripts: "scripts for Readme",
					scripts_config: "Configration for Readme",
					options: ["Readme","discuz.k"],
					option_configration: ["Configration for Readme", "Configration for discuz.k"],
					option_scripts: ["scripts for Readme", "scripts for discuz.k"],
				},
				methods:{
					onChange (index) {
						console.log("onchange" + index);
						scripts_config=option_scripts[index];
						scripts=option_scripts[index];
					}
				}
			});
		</script>
	</body>
</html>
